<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>爱游网</title>
    <link rel="stylesheet" href="./css/base.css" />
    <link rel="stylesheet" href="./css/style.css" />
    <link rel="stylesheet" href="./css/public.css" />
    <link rel="stylesheet" href="./fonts/iconfont.css" />
    <link rel="stylesheet" href="./css/swiper-bundle.min.css" />
    <link rel="stylesheet" href="./css/style5.css" />
  </head>
  <body>
    <div class="top">
      <div class="w">
        <div class="logo fl">
          <img src="./images/logo.jpg" alt="" />
        </div>
        <div class="num fr">
          <span class="iconfont">&#xe65b; 000-0000000</span>
        </div>
      </div>
    </div>
    <div class="nav">
      <div class="nav_menu w">
        <div class="menu_item">
          <a href="./首页.html" class="home">首页</a>
          <a href="./首页.html" class="web_home">首页</a>
        </div>
        <div class="menu_item">
          <a href="./旅游攻略.html" class="cur home">旅游攻略</a>
          <a href="./旅游攻略.html" class="cur web_home">旅游攻略</a>
        </div>
        <div class="menu_item">
          <a href="./精选路线.html" class="home">精选路线</a>
          <a href="./精选路线.html" class="web_home">精选路线</a>
        </div>
        <div class="menu_item">
          <a href="./定制游.html" class="home">定制游</a>
          <a href="./定制游.html" class="web_home">定制游</a>
        </div>
        <div class="menu_item">
          <a href="./周边游.html" class="home">周边游</a>
          <a href="./周边游.html" class="web_home">周边游</a>
        </div>
        <div class="search-box">
          <input
            type="text" class="search-txt"
            placeholder="热门搜索：欧洲、美洲、中东非、澳新、马代.."
          />
          <a href="#" class="search-btn">
            <i class="iconfont icon-search" aria-hidden="true">&#xe78b;</i>
          </a>
        </div>
        </div>
    </div>
    <!-- 中间部分开始 -->
    <!-- 照片部分 -->
    <div class="box">
      <img src="./images/banner1.jpg" alt="" />
    </div>
    <!-- 照片部分结束 -->
    <!-- 下面大盒子开始 -->
    <div class="box1">
      <!-- 大盒子里面第一个盒子 -->
      <div class="box1_1">
        <div class="box1_11 fl">
          <img src="./images/day2.jpg" alt="" />
        </div>
        <div class="box1_12 fl">
          <p>秋色浓淡，水城乌镇</p>
          <p>预算/人：<i>￥1499元.00</i></p>
          <p>行程天数：5天</p>
          <p>目的地：乌镇</p>
          <div class="anniu">
            <button class="fl">
              <i class="iconfont">&#xe60d;</i>138000000
            </button>
            <button class="fr">预约</button>
          </div>
        </div>
      </div>
      <!-- 大盒子里面第二个盒子 -->
      <div class="box1_2">
        <p>
          分享到: <i class="iconfont">&#xe66a;</i
          ><i class="iconfont">&#xe65e;</i><i class="iconfont">&#xe6c3;</i>
        </p>
      </div>
      <!-- 第二个盒子结束 -->
      <!-- 下面文字开始 -->
      <div class="box1_3">
        <p>上一个：千岛湖二日清新游，拥抱自然</p>
        <p>下一个：秋色浓淡，相约蒙古</p>
      </div>
      <!-- 下面文字结束 -->
      <!-- 最下面的盒子开始 -->
      <div class="box1_4">
        <div class="box1_41">产品详情</div>
      </div>
      <!-- 最下面的盒子结束 -->
    </div>

    <!-- 下面大盒子结束 -->
    <div class="bear">
      <div class="box_box"></div>
    </div>
    <!-- 中间部分结束 -->
    <!-- 页脚 -->
    <div class="footer">
      <div class="w">
        <div class="fo1">
          <span class="iconfont">&#xe629;</span>
          <h2>阳光行程</h2>
          <p>透明公开</p>
        </div>
        <div class="fo2">
          <span class="iconfont">&#xe643;</span>
          <h2>阳光价格</h2>
          <p>明码实价</p>
        </div>
        <div class="fo3">
          <span class="iconfont">&#xe63b;</span>
          <h2>阳光服务</h2>
          <p>专属客服</p>
        </div>
        <div class="fo4">
          <span class="iconfont">&#xe65b;</span>
          <h2>服务电话</h2>
          <p>000-000-0000</p>
        </div>
      </div>
    </div>
    <div class="footb">
      <div class="w">
        <dl class="fl">
          <dt>去旅游</dt>
          <dd>跟团游</dd>
          <dd>海岛游</dd>
          <dd>门票</dd>
          <dd>机票+酒店</dd>
          <dd>客服推荐</dd>
        </dl>

        <dl class="fl">
          <dt class="ddt">去旅游</dt>
          <dd>跟团游</dd>
          <dd>海岛游</dd>
          <dd>门票</dd>
          <dd>机票+酒店</dd>
          <dd>客服推荐</dd>
        </dl>

        <dl class="fl">
          <dt class="ddt">去旅游</dt>
          <dd>去旅游</dd>
          <dd>海岛游</dd>
          <dd>门票</dd>
          <dd>机票+酒店</dd>
          <dd>客服推荐</dd>
        </dl>
        <div class="bx"></div>
        <dl class="fl">
          <dt>找优惠</dt>
          <dd>去旅游</dd>
          <dd>海岛游</dd>
          <dd>门票</dd>
          <dd>机票+酒店</dd>
          <dd>客服推荐</dd>
        </dl>
        <div class="bx1"></div>
        <dl class="fl">
          <dt>看攻略</dt>
          <dd>去旅游</dd>
          <dd>海岛游</dd>
          <dd>门票</dd>
          <dd>机票+酒店</dd>
          <dd>客服推荐</dd>
        </dl>
        <div class="bx1"></div>
        <dl class="fl">
          <dt>查服务</dt>
          <dd>去旅游</dd>
          <dd>海岛游</dd>
          <dd>门票</dd>
          <dd>机票+酒店</dd>
          <dd>客服推荐</dd>
        </dl>
        <div class="bx1"></div>
      </div>
    </div>
    <script src="./js/swiper-bundle.min.js"></script>
    <script>
      var mySwiper = new Swiper(".swiper-container", {
        direction: "horizontal", // 垂直切换选项
        loop: true, // 循环模式选项
        autoplay: true,
        // 如果需要分页器
        pagination: {
          el: ".swiper-pagination",
        },
      });
    </script>
  </body>
</html>
